<template>
    <Page>
        <div class="search">
            <el-form :inline="true" :model="form" class="demo-form-inline">
                <el-form-item label="优惠券名称">
                    <el-input v-model="form.user" placeholder="请输入" size="small"></el-input>
                </el-form-item>
                <el-form-item label="店铺名称">
                    <el-input v-model="form.user" placeholder="请输入" size="small"></el-input>
                </el-form-item>
                <el-form-item label="优惠券类型">
                    <el-input v-model="form.user" placeholder="请输入" size="small"></el-input>
                </el-form-item>
                <el-form-item label="优惠券状态">
                    <el-input v-model="form.user" placeholder="请输入" size="small"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit" size="small">查询</el-button>
                    <el-button type="primary" @click="onSubmit" size="small" plain>重置</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="datalist">
            <div class="table-header"></div>
            <div class="table-list">
                <el-table
                    :data="listData"
                    stripe
                    style="width:100%"
                    width="100%"
                    :highlight-current-row="false"
                    size="small"
                    :header-cell-style="{background:'#FAFAFA',color:'#666', fontSize:'13px'}"
                >
                    <el-table-column prop="date" label="店铺名称"></el-table-column>
                    <el-table-column prop="name" label="优惠券名称"></el-table-column>
                    <el-table-column prop="address" label="优惠券类型"></el-table-column>
                    <el-table-column prop="address" label="面值参数"></el-table-column>
                    <el-table-column prop="address" label="条件"></el-table-column>
                    <el-table-column prop="address" label="发放数量"></el-table-column>
                    <el-table-column prop="address" label="已领取"></el-table-column>
                    <el-table-column prop="address" label="已使用"></el-table-column>
                    <el-table-column prop="address" label="发券时间"></el-table-column>
                    <el-table-column prop="address" label="券状态"></el-table-column>
                    <el-table-column prop="address" label="操作">
                        <template slot-scope="scope">
                            <el-button type="text">详情</el-button>
                            <el-button type="text">数据</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div class="list-paginate">
                    <el-pagination
                        background
                        layout="total, prev, pager, next"
                        :current-page="form.current"
                        :page-size="form.size"
                        :total="100"
                        @current-change="changePage"
                    ></el-pagination>
                </div>
            </div>
        </div>
        <Detail ref="detail"></Detail>
        <Data ref="data"></Data>
    </Page>
</template>
<script>
import Page from "@/components/page/Page";
import Detail from "./detail";
import Data from "./data";
export default {
    data(){
        return {
            form:{},
            listData:[{
                name:1
            }],
        }
    },
    mounted() {},
    methods:{
        onSubmit(){},
        // 分页点击
        changePage(e){},
    },
    components:{
        Page,
        Detail,
        Data
    }
}
</script>
<style lang="less" scoped>
.page{

}
</style>
